<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>

    <link rel="stylesheet" href="../css/tableTest.css">

</head>

<body>
    <section id="content">
        <h1>用户信息注册</h1>
        <form action="#" method="POST">
            <table>
                <tbody>
                    <tr>
                        <td> <label for="userName" class="text">用户名：</label> </td>
                        <td>
                            <input type="text" name="userName" id="userName" placeholder="请输入英文字母或数字"
                                class="normal-input">
                        </td>
                        <td>
                            <nav id="userNameMsg">
                                <div class="msgImage"></div>
                                <div class="msgInfo"></div>
                            </nav>
                        </td>
                    </tr>
                    <tr>
                        <td> <label for="userNickName" class="text">昵称：</label> </td>
                        <td>
                            <input type="text" name="userNickName" id="userNickName" placeholder="可输入中文信息"
                                class="normal-input">
                        </td>
                        <td>
                            <nav id="userNickNameMsg">
                                <div class="msgImage"></div>
                                <div class="msgInfo"></div>
                            </nav>
                        </td>
                    </tr>
                    <tr>
                        <td> <label for="userPasswd" class="text">密码：</label> </td>
                        <td>
                            <input type="password" name="userPasswd" id="userPasswd" placeholder="请输入密码"
                                class="normal-input">
                        </td>
                        <td>
                            <nav id="userPWmsg">
                                <div class="msgImage"></div>
                                <div class="msgImage"></div>
                            </nav>
                        </td>
                    </tr>
                    <tr>
                        <td><label for="repeatPW" class="text">重复密码：</label></td>
                        <td>
                            <input type="password" name="repeatPW" id="repeatPW" placeholder="请再次输入密码"
                                class="normal-input">
                        </td>
                        <td>
                            <nav id="repeatPWmsg">
                                <div class="msgImage"></div>
                                <div class="msgImage"></div>
                            </nav>
                        </td>
                    </tr>
                    <tr>
                        <td class="text">性别：</td>
                        <td colspan="2">
                            <div class="td_div">
                                <input type="raDio" name="sex" id="manUser" value="1" class="normalRadio">
                                <label for="manUser" class="checkText text">男</label>
                                <input type="radio" name="sex" id="womanUser" value="2" class="normalRadio">
                                <label for="manUser" class="checkText text">女</label>
                            </div>
                        </td>
                    </tr>

                    <tr>
                        <td> <label for="userPhone" class="text">手机号：</label> </td>
                        <td>
                            <input type="text" name="userPhone" id="userPhone" placeholder="请输入手机号"
                                class="normal-input">
                        </td>
                        <td>
                            <nav id="userPhonemsg">
                                <div class="msgImage"></div>
                                <div class="msgInfo"></div>
                            </nav>
                        </td>
                    </tr>
                    <tr>
                        <td> <label for="userEmail" class="text">e-main：</label> </td>
                        <td>
                            <input type="text" name="userEmail" id="userEmail" placeholder="请输入邮箱" class="normal-input">
                        </td>
                        <td>
                            <nav id="userEmailmsg">
                                <div class="msgImage"></div>
                                <div class="msgInfo"></div>
                            </nav>
                        </td>
                    </tr>
                    <tr>
                        <td> <label for="userPhone" class="text">生日: </label> </td>
                        <td>
                            <input type="date" name="userBirthday" id="userBirthday" placeholder="请输入手机号"
                                class="normal-input">
                        </td>
                        <td>
                            <nav id="userBirthdaymsg">
                                <div class="msgImage"></div>
                                <div class="msgInfo"></div>
                            </nav>
                        </td>
                    </tr>
                    <tr>
                        <td class="text"> 爱好: </td>
                        <td colspan="2">
                            <div class="td_div">
                                <input type="checkbox" name="hobby" id="music" class="normalBox">
                                <label for="music" class="text checkText">唱歌</label> &nbsp;&nbsp;
                                <input type="checkbox" name="hobby" id="dance" class="normalBox">
                                <label for="dance" class="text checkText">跳舞</label> &nbsp;&nbsp;
                                <input type="checkbox" name="hobby" id="rape" class="normalBox">
                                <label for="rape" class="text checkText">rape</label> &nbsp;&nbsp;
                                <input type="checkbox" name="hobby" id="rap" class="normalBox">
                                <label for="rap" class="text checkText">rap</label> &nbsp;&nbsp;
                            </div>
                        </td>
                        <td></td>
                    </tr>
                    <tr>
                        <td class="text">来自于：</td>
                        <td colspan="2">
                            <div class="td_div">
                                <select name="province" id="province" class="normal-input"></select>
                                <select name="city" id="city" class="normal-input"></select>
                            </div>
                        </td>
                        <td></td>
                    </tr>
                    <tr>
                        <td> <label for="userMore" class="text">备注：</label> </td>
                        <td>
                            <input type="text" name="userMore" id="userMore" placeholder="备注" class="normal-input"
                                style="height: 50px;">
                        </td>
                        <td>
                            <nav id="userMoremsg">
                                <div class="msgImage"></div>
                                <div class="msgInfo"></div>
                            </nav>
                        </td>
                    </tr>
                </tbody>
            </table>
        </form>
        <nav class="btn_nav">
            <button type="reset" class="login-button">重置</button>&nbsp;&nbsp;
            <button type="submit" class="login-button"> <a href="./tableTest01.html"> 注册</a></button>
        </nav>
    </section>
</body>

</html>